<template>
  <van-empty
    v-if="!userList || userList.length < 1"
    image="search"
    description="数据为空"
  />
  <userCardList
    :userList="userList"
    @getMore="getMore"
    @invite="handleInvite"
    v-else
  ></userCardList>
  <van-popup
    :show="showPopop"
    round
    position="bottom"
    custom-style="height: 50%"
    @close="closePopup"
  >
    <van-radio-group :value="selectTeamOne" @change="selectTeam">
      <van-cell-group>
        <van-cell
          size="large"
          :title="`队伍${index + 1}：` + item.name"
          clickable
          data-name="1"
          v-for="(item, index) in teamList"
          :key="item.id"
        >
          <van-radio slot="right-icon" :name="item.id" />
        </van-cell>
      </van-cell-group>
    </van-radio-group>

    <div class="btn-pop">
      <van-button type="info" block round @click="confirmInvite"
        >确定邀请</van-button
      >
    </div>
  </van-popup>
  <van-notify id="van-notify" />
</template>

<script setup>
import { ref, reactive, onMounted } from 'vue'
import { debounce, throttle } from '../../utils/tool.js'
import useStore from '../../store'
import userCardList from '../../components/userCardList.vue'
import { searchByTag } from '../../api/user/userApi'
import { hasCreatedTeam, sendMsg } from '../../api/team/team'

let showPopop = ref(false)
const teamList = ref([]) //已经创建的队伍列表
let selectTeamOne = ref() //选中一个队伍
let selectUserOne = ref() //选中一个用户

let userList = ref([])
const gatTagNameList1 = () => {}
const tagList = useStore().user().TAGLIST
console.log(tagList)

const getUser = async () => {
  const res = await searchByTag(tagList)
  console.log(res)
  userList.value = res.data
  userList.value?.forEach((item) => {
    item.tags = JSON.parse(item.tags)
  })
}

//获取已经创建的队伍
const getHasCreatedTeam = async () => {
  const res = await hasCreatedTeam()
  console.log(res)
  
  teamList.value = res.data.teamUserVOList
  selectTeamOne.value = teamList.value[0].id
}
//触底加载
const getMore1 = async () => {
  console.log(maxPage.value);
  
  if(pageNum.value>=maxPage.value){
    return uni.showToast({
      title:'到底了',
      icon:'none'
    })
  }
  console.log('到底了')
  pageNum.value++
  console.log(pageNum.value)

  const res = await recommendUser(pageNum.value, pageSize.value)
  console.log(res.data.records)
  let resArr = res.data.records
  console.log(resArr)
  resArr?.forEach((item) => {
    item.tags = JSON.parse(item.tags)
  })
  userList.value = [...userList.value, ...resArr]
  console.log(userList.value)

  console.log()

  //  userList.value=userList.value.push(res.data.records)
}
//节流
const getMore = throttle(getMore1, 1000)

//邀请组队
const handleInvite = (e) => {
  if (uni.getStorageSync('Authorization') === null) {
    uni.showToast({
      title: '请登录',
      icon: 'none',
    })
    uni.switchTab({
      url: '/pages/person/person',
    })
    return false
  }
  console.log(e)
  selectUserOne.value = e
  showPopop.value = true
  getHasCreatedTeam()
}
//选中队伍
const selectTeam = (e) => {
  selectTeamOne.value=e.detail
  console.log(e)
}
//确定邀请
const confirmInvite = async () => {
  if(teamList.value===null||teamList.value<=0){
    showPopop.value = false
    uni.showToast({
      title:'队伍为空，请先创建队伍',
      icon:'none',
      duration:2000
    })
    return
  }
  const obj={
    userId:selectUserOne.value ,
    teamId:selectTeamOne.value ,
  }
 const res=await useStore().team().sendInvitation(obj)
 console.log(res);
 if(res.code===0){
  uni.showToast({
  title:'发送成功',
  icon:'success',
  success:()=>{
    closePopup()
  }

 })
 }else{
  uni.showToast({
  title:'发送失败:'+res.description,
  icon:'none',
  success:()=>{
    closePopup()
  }

 })
}
 
  // uni.requestSubscribeMessage({
  //   tmplIds: ['lZH_Sb4eub8CNfw3EoEJ2PaJAQOG2u7jvTrCL0U7TwM'],
  //   success: async (res) => {
  //     console.log('订阅授权', res)
  //     console.log('userId:' + selectUserOne.value)

  //     const sendRes = await sendMsg(selectUserOne.value, selectTeamOne.value)
  //     console.log(sendRes)
  //   },
  // })
}
//关闭弹出窗
const closePopup = () => {
  showPopop.value = false
}
onMounted(() => {
  getUser()
})
</script>
<style scoped></style>
